<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width,user-scalable=no,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0">
	<title>智慧农业云服务-首页</title>
	<link rel="stylesheet" href="/layui/css/layui.css">
	<link rel="stylesheet" href="/css/index.css">
	<style>
		.nav.index {
			background: rgba(33, 33, 33 ,1);
		}
		.nav .layui-nav .layui-nav-item a {
			color: #8890a4;
		}
		#banner,#banner img {
			height: 700px !important;
		}
		.main-product {
			padding-top: 15px;
		}
		.nav .layui-nav .layui-nav-item {
			margin: 0 35px;
		}
		.nav .layui-nav * {
			font-size: 16px;
		}
		.layui-carousel-ind {
			top: -160px;
		}
		/*导航下图标信息*/
		.hp-online {
			min-width: 1300px;
			width: 100%;
			height: 121px;
			background: rgba(41,44,54,0.9);
			position: absolute;
			margin-top: -121px;
			z-index: 1;
		}
		.hp-online .online-container {
			overflow: hidden;
			margin: 0 auto;
		}
		.flex {
			display: -moz-box;
			display: -webkit-box;
			display: -ms-flexbox;
			display: -webkit-flex;
			display: flex;
		}
		.PAGE_WIDTH {
			width: 1200px;
		}
		.hp-online .online-container .online-box {
			width: 25%;
			float: left;
			flex: 1;
			height: 121px;
			box-sizing: border-box;
			-moz-transition: all .4s ease 0s;
			-webkit-transition: all .4s ease 0s;
			-ms-transition: all .4s ease 0s;
			-webkit-transition: all .4s ease 0s;
			transition: all .4s ease 0s;
		}
		.hp-online .online-container .online-box a {
			box-sizing: border-box;
			display: inline-block;
			width: 100%;
			height: 100%;
			padding: 35px 0px 0px 21px;
			color: #8890a4;
			-moz-transition: all .4s ease 0s;
			-webkit-transition: all .4s ease 0s;
			-ms-transition: all .4s ease 0s;
			-webkit-transition: all .4s ease 0s;
			transition: all .4s ease 0s;
			overflow: hidden;
		}
		a {
			background: transparent;
			text-decoration: none;
			color: #08c;
		}
		.hp-online .online-container .online-box .icon {
			padding-top: 5px;
			width: 38px;
			height: 43px;
			-moz-transition: all .4s ease 0s;
			-webkit-transition: all .4s ease 0s;
			-ms-transition: all .4s ease 0s;
			-webkit-transition: all .4s ease 0s;
			transition: all .4s ease 0s;
			fill: #8890a4;
			margin-bottom: 25px;
		}
		.hp-online .online-container .online-box a svg {
			float: left;
			margin-right: 11px;
		}
		svg:not(:root) {
			overflow: hidden;
		}
		.hp-online .online-container .online-box a div {
			float: left;
			padding: 5px;
		}
		.hp-online .online-container .online-box:hover {
			background-color: #14161b;
		}
		.hp-online .online-container .online-box a div .title1 {
			font-size: 16px;
		}
		.footer {
			background: #2e3037;
		}
	</style>
</head>
<body>
<!-- nav部分 -->
<div class="nav index">
	<div class="layui-container">
		<!-- 公司logo -->
		<div class="nav-logo">
			<a href="index.html">
				<img width="200" height="50" src="/img/index/logo1.png" alt="智慧农业">
			</a>
		</div>
		<div class="nav-list">
			<button>
				<span></span><span></span><span></span>
			</button>
			<ul class="layui-nav" lay-filter="">
				<li class="layui-nav-item"><a href="/">首页</a></li>
				<li class="layui-nav-item"><a href="/">产品溯源</a></li>
				<li class="layui-nav-item"><a href="/">农技服务</a></li>
				<li class="layui-nav-item"><a href="/">农业商城</a></li>
				<li class="layui-nav-item"><a href="/">反馈与帮助</a></li>
				<li class="layui-nav-item"><a href="http://localhost:8084" target="_blank">控制台</a></li>
			</ul>
		</div>
	</div>
</div>
<!-- banner部分 -->
<div>
	<div class="layui-carousel" id="banner">
		<div carousel-item>
			<div>
				<img src="/img/index/banner1.jpg">
				<div class="panel">
					<p class="title">智慧农业云服务</p>
					<p>完美产品体验</p>
				</div>
			</div>
			<div>
				<img src="/img/index/banner1.jpg">
				<div class="panel">
					<p class="title">智慧农业云服务</p>
					<p>完美产品体验</p>
				</div>
			</div>
		</div>
		<div class="hp-online">
			<div class="PAGE_WIDTH flex online-container">

				<div class="online-box">
					<a href="/" >
						<i style="float: left;font-size: 35px;padding: 5px;padding-right: 20px;" class="layui-icon layui-icon-console"></i>
						<div>
							<p class="title1">
								智慧农业行业解决方案
							</p>
							<p class="title2">场景化服务全面升级</p>
						</div>
					</a>
				</div>
				<div class="online-box">
					<a href="/" >
						<i style="float: left;font-size: 35px;padding: 5px;padding-right: 20px;" class="layui-icon layui-icon-chart"></i>
						<div>
							<p class="title1">
								大数据分析工具
							</p>
							<p class="title2">全方位解析数据</p>
						</div>
					</a>
				</div>
				<div class="online-box">
					<a href="/" >
						<i style="float: left;font-size: 35px;padding: 5px;padding-right: 20px;" class="layui-icon layui-icon-website"></i>
						<div>
							<p class="title1">
								农业产品溯源解决方案
							</p>
							<p class="title2">感谢开发者的支持与陪伴</p>
						</div>
					</a>
				</div>
				<div class="online-box">
					<a href="/" >
						<i style="float: left;font-size: 35px;padding: 5px;padding-right: 20px;" class="layui-icon layui-icon-template"></i>
						<div>
							<p class="title1">
								农技个性化推荐服务
							</p>
							<p class="title2">请各位开发者及时关注</p>
						</div>
					</a>
				</div>

			</div>
		</div>
	</div>
</div>
<!-- main部分 -->
<div class="main-product">
	<div class="layui-container">
		<p class="title">专为农业而研制的<span>云产品</span></p>
		<div class="layui-row layui-col-space25">
			<div class="layui-col-sm6 layui-col-md3">
				<div class="content">
					<div><img src="/img/index/Big_icon1.png"></div>
					<div>
						<p class="label">物联网监控</p>
						<p>实时监控产业生产环境，为用户提供一个良好的可视化平台</p>
					</div>
					<a href="javascript:;">查看产品 ></a>
				</div>
			</div>
			<div class="layui-col-sm6 layui-col-md3 ">
				<div class="content">
					<div><img src="/img/index/Big_icon2.png"></div>
					<div>
						<p class="label">产品溯源</p>
						<p>从开始到结束，追踪产品的整个生产过程，质量可追踪，为用户提供一个安全放心可靠的产品</p>
					</div>
					<a href="javascript:;">查看产品 ></a>
				</div>
			</div>
			<div class="layui-col-sm6 layui-col-md3 ">
				<div class="content">
					<div><img src="/img/index/Big_icon3.png"></div>
					<div>
						<p class="label">农业电商平台</p>
						<p>为用户展示质量优质的农产品，追溯质量，展示当前农产品的市场行情。</p>
					</div>
					<a href="javascript:;">查看产品 ></a>
				</div>
			</div>
			<div class="layui-col-sm6 layui-col-md3 ">
				<div class="content">
					<div><img src="/img/index/Big_icon4.png"></div>
					<div>
						<p class="label">农技服务</p>
						<p>为用户的生产提供可考的理论支持，个性化推荐农技，为您量身定制农技服务</p>
					</div>
					<a href="javascript:;">查看产品 ></a>
				</div>
			</div>
		</div>
	</div>
</div>
<div class="main-service">
	<div class="layui-container">
		<p class="title">为客户打造完美的<span>专业服务</span></p>
		<div class="layui-row layui-col-space25 layui-col-space80">
			<div class="layui-col-sm6">
				<div class="content">
					<div class="content-left"><img src="/img/index/home_img1.jpg"></div>
					<div class="content-right">
						<p class="label">1 对 1 专业指导</p>
						<span></span>
						<p>为客户提供一整套农业产业链的服务。为客户提供一整套农业产业链的服务。</p>
					</div>
				</div>
			</div>
			<div class="layui-col-sm6">
				<div class="content">
					<div class="content-left"><img src="/img/index/home_img2.jpg"></div>
					<div class="content-right">
						<p class="label">1 对 1 专业指导</p>
						<span></span>
						<p>为客户提供一整套农业产业链的服务。为客户提供一整套农业产业链的服务。</p>
					</div>
				</div>
			</div>
			<div class="layui-col-sm6">
				<div class="content">
					<div class="content-left"><img src="/img/index/home_img3.jpg"></div>
					<div class="content-right">
						<p class="label">1 对 1 专业指导</p>
						<span></span>
						<p>为客户提供一整套农业产业链的服务。为客户提供一整套农业产业链的服务。</p>
					</div>
				</div>
			</div>
			<div class="layui-col-sm6">
				<div class="content">
					<div class="content-left"><img src="/img/index/home_img4.jpg"></div>
					<div class="content-right">
						<p class="label">1 对 1 专业指导</p>
						<span></span>
						<p>为客户提供一整套农业产业链的服务。为客户提供一整套农业产业链的服务。</p>
					</div>
				</div>
			</div>
		</div>
		<div class="service-more"><a href="">查看更多</a></div>
	</div>
</div>
<!-- footer部分 -->
<div class="footer">
	<div class="layui-container">
		<p class="footer-web">
			<a href="javascript:;">合作伙伴</a>
			<a href="javascript:;">企业画报</a>
			<a href="javascript:;">JS网</a>
			<a href="javascript:;">千图网</a>
			<a href="javascript:;">昵图网</a>
			<a href="javascript:;">素材网</a>
			<a href="javascript:;">花瓣网</a>
		</p>
		<div class="layui-row footer-contact">
			<div class="layui-col-sm2 layui-col-lg1"><img src="/img/index/erweima.jpg"></div>
			<div class="layui-col-sm10 layui-col-lg11">
				<div class="layui-row">
					<div class="layui-col-sm6 layui-col-md8 layui-col-lg9">
						<p class="contact-top"><i class="layui-icon layui-icon-cellphone"></i>&nbsp;400-8888888&nbsp;&nbsp;(9:00-18:00)</p>
						<p class="contact-bottom"><i class="layui-icon layui-icon-home"></i>&nbsp;88888888@163.com</span></p>
					</div>
					<div class="layui-col-sm6 layui-col-md4 layui-col-lg3">
						<p class="contact-top"><span class="right">该模板版权归 <a href="https://www.layui.com/" target="_blank">layui.com</a> 所有</span></p>
						<p class="contact-bottom"><span class="right">Copyright&nbsp;©&nbsp;2016-2018&nbsp;&nbsp;ICP&nbsp;备888888号</span></p>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
<script src="/layui/layui.js"></script>
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
<script>
    layui.config({
        base: '/js/'
    }).use('firm');
</script>
</body>
</html>